<template>
	<view style="height:500rpx;">
		<GoodsWayArr v-model="goodsWayArr" :isCustomer="true" :goodsArr="goodsArr" :widthsArr="widthsArr"></GoodsWayArr>
	</view>
</template>

<script>
	import GoodsWayArr from '@/components/goods-way-arr.vue';
	export default {
		components:{
			GoodsWayArr
		},
		data() {
			return {
				goodsWayArr:[],
				goodsArr:[],
				widthsArr:[]
			};
		},
		onLoad(){
			this.goodsWayArr=this.$store.state.machine.goodsWayArr;
			this.goodsArr=this.$store.state.machine.goodsArr;
			this.widthsArr=this.$store.state.machine.widthsArr;
		},
		computed:{
			// getWidth(){
			// 	return function(width){
			// 		let filterGoodsWayArr=this.$store.state.machine.goodsWayArr.filter(item=>{return item.y==0});
			// 		let maxWidth=0;
			// 		this.$store.state.machine.goodsWayArr.forEach(item=>{
			// 			if(item.y==0){
			// 				maxWidth+=item.width;
			// 			}
			// 		})
			// 		return `calc(100%/${maxWidth}*${width})`;
			// 	}
			// },
			// getImage(){
			// 	return function(goodsId){
			// 		let goods=this.$store.state.machine.goodsArr.find(item=>{return item._id==goodsId});
			// 		return !!goods?goods.img:'';
			// 	}           
			// }
		},
		methods:{
			// toEdit(_id){
			// 	this.$u.route('/pages/customer/machineGoodsWayEdit',{_id:_id});
			// }
		}
	}
</script>

<style lang="scss">
.container{
	flex-wrap: wrap;
	display:flex;
	justify-content: flex-start;
	border-top:2rpx solid #ccc;
	border-left:2rpx solid #ccc;
}
.col{
	box-sizing: border-box;
	display:flex;
	justify-content: center;
	align-items: center;
	min-height:100rpx;
	border-bottom:2rpx solid #ccc;
	border-right:2rpx solid #ccc;
}
</style>
